<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>

<form id="user-add-form" method="post" style="padding: 10px;">  
    <p>   
        <label for="loginName">登录名:</label><span>&nbsp;&nbsp;&nbsp;&nbsp;</span>   
        <input class="easyui-validatebox" type="text" name="loginName" 
         data-options="required:true,missingMessage:'登录名称不能为空'" onblur="user.checkUser('loginName',this.value,'登录名')" />
        <span id="loginName-tip"></span>
    </p>
     <p>   
        <label for="name">名&nbsp;&nbsp;&nbsp;称:</label><span>&nbsp;&nbsp;&nbsp;&nbsp;</span>   
        <input class="easyui-validatebox" type="text" name="name" 
         data-options="required:true,missingMessage:'用户名称不能为空'" />
        <span id="name-tip"></span>
    </p>
     <p>   
        <label for="phone">电&nbsp;&nbsp;&nbsp;话:</label><span>&nbsp;&nbsp;&nbsp;&nbsp;</span>   
        <input class="easyui-validatebox" type="text" name="phone" 
         data-options="required:true,missingMessage:'手机号码不能为空'" onblur="user.checkUser('phone',this.value,'手机号码')" />
        <span id="phone-tip"></span>
    </p>
     <p>   
        <label for="email">邮&nbsp;&nbsp;&nbsp;箱:</label><span>&nbsp;&nbsp;&nbsp;&nbsp;</span>   
        <input class="easyui-validatebox" type="text" name="email" 
         data-options="required:true,missingMessage:'邮箱不能为空',validType:'email'" onblur="user.checkUser('email',this.value,'邮箱')" />
        <span id="email-tip"></span>
    </p>
     <p>   
        <label for="identity">身份证:</label><span>&nbsp;&nbsp;&nbsp;&nbsp;</span>   
        <input class="easyui-validatebox" type="text" name="identity" 
         data-options="required:true,missingMessage:'身份证不能为空',validType:'length[18,18]'" onblur="user.checkUser('identity',this.value,'身份证')" />
        <span id="identity-tip"></span>
    </p>
</form>  

<script type="text/javascript">
	user.add=function(){
		$('#user-add-form').form('submit', {
			url: '/user/add',
			onSubmit: function(){
				// 返回false终止表单提交
				if(!$(this).form('validate'))
					return false;
				
				var loginName = $('#user-add-form input[name="loginName"]').val();
				if(!user.checkUser('loginName',loginName,'登录名'))
					return false;
				
				var phone = $('#user-add-form input[name="phone"]').val();
				if(!user.checkUser('phone',phone,'手机号码'))
					return false;
				
				var email = $('#user-add-form input[name="email"]').val();
				if(!user.checkUser('email',email,'邮箱'))
					return false;
				
				var identity = $('#user-add-form input[name="identity"]').val();
				if(!user.checkUser('identity',identity,'身份证'))
					return false;
				
				return true;	
			},
			success: function(msg){
				//把字符串转化成 json对象
				var msg = JSON.parse(msg);
				if(msg.code == 200){
					//添加成功后，更新表格
					$('#user-list-dg').datagrid('reload');
					$.messager.alert('提示','添加成功！','info');
				}
			}
		});
	}
	
	/**
	* key  :  属性名称
	* value:  属性值
	* tip  :  属性中文提示名称
	*/
	user.checkUser=function(key,value,tip){
		var value = $.trim(value);
		if(value == ''){
			return;
		}
		//用户被占用
		var flag= false;
		
		//改成同步
		$.ajax({
		   type: "get",
		   async:false,
		   url: "/user/check",
		   data: key+"="+value,
		   success: function(msg){
			 var selector = '#'+key+'-tip';
		     if(msg.code == 200 && !msg.data){
		    	 $(selector).html("<font color='green'>该"+tip+"可以使用</font>");
		    	 flag = true;
		     }else if(msg.code == 200 && msg.data){
		    	 $(selector).html("<font color='red'>该"+tip+"已被使用</font>");
		     }
		   }
		});
		
		return flag;
	}
</script>